<!DOCTYPE html>
<html lang="zh-CN">
<head>
	<title>表结构</title>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<link rel="shortcut icon" href="./favicon.ico">
	<script type="text/javascript" src="js/plugin/jquery.min.js"></script>
	<script type="text/javascript" src="js/plugin/vue/vue-2.4.2.min.js"></script>
	<script type="text/javascript" src="js/plugin/fullscreen.js"></script>
	<script type="text/javascript" src="js/plugin/bootstrap-3.3.5/js/bootstrap.min.js"></script>
	<script type="text/javascript" src="js/plugin/bootstrap-3.3.5/js/bootstrap-select.min.js"></script>
	<script type="text/javascript" src="js/plugin/bootstrap-3.3.5/js/defaults-zh_CN.min.js"></script>
	<script type="text/javascript" src="js/sybn_bootstrap.js"></script>
	<link rel="stylesheet" href="css/fontawesome-4.2.0_ie7/4.2.0/css/font-awesome.min.css">
	<link rel="stylesheet" href="js/plugin/bootstrap-3.3.5/css/bootstrap.min.css">
	<link rel="stylesheet" href="js/plugin/bootstrap-3.3.5/css/bootstrap-select.min.css">
	<link rel="stylesheet" href="css/bootstrap_sybn_custom.css">
<style>
html,body{font-size:9px;margin:0;padding:0;height:100%;color:#999;overflow-x:hidden;}
fieldinfo{display: block;width: 100%;padding-left: 2em;}
valueinfo{display: block;width: 100%;padding-left: 4em;}
.l_title{display: inline-block;width: 6em;text-align:left;}
</style>
</head>
<body>

<ul class="nav nav-tabs">
  <li><strong class="title">show table info</strong></li>
</ul>
	<div id="body">
		<!-- job -->
		<div class="panel panel-primary w100" v-for="tableinfo in res.rows">
			<div class="panel-heading text-primary">
				<span class="p_title">{{tableinfo.databases}} - {{tableinfo.table_name}}</span>
				<span class="floatRight fa fa-chevron-down collapsed" v-bind:id="'p_block_show_'+tableinfo.id" data-toggle="collapse" v-bind:data-target="'#block_show_'+tableinfo.id"></span>
				<span class="floatLeft margin fa fa-compress"></span>
			</div>
			<div v-bind:id="'block_show_'+tableinfo.id" class="panel-body collapse">
			<div class="col-xs-2 padding0"><div class="input-group input-group-xs"><span class="input-group-addon"><strong class="l_title">数据库名</strong></span><span class="form-control">{{tableinfo.databases}}</span></div></div>
			<div class="col-xs-2 padding0"><div class="input-group input-group-xs"><span class="input-group-addon"><strong class="l_title">表名</strong></span><span class="form-control">{{tableinfo.table_name}}</span></div></div>
			<div class="col-xs-4 padding0"><div class="input-group input-group-xs"><span class="input-group-addon"><strong class="l_title">简介</strong></span><span class="form-control">{{tableinfo.desc}}</span></div></div>
			<div class="col-xs-2 padding0"><div class="input-group input-group-xs"><span class="input-group-addon"><strong class="l_title">更新时间</strong></span><span class="form-control">{{tableinfo.table_update_time}}</span></div></div>
			<div class="col-xs-2 padding0"><div class="input-group input-group-xs"><span class="input-group-addon"><strong class="l_title">结构版本</strong></span><span class="form-control">{{tableinfo.table_version}}</span></div></div>
			<div class="col-xs-12 padding0 panel panel-info">
				<div class="panel-heading text-primary">
					<span class="p_title">字段列表 (点此展开/关闭)</span>
					<span class="floatRight fa fa-chevron-down" v-bind:id="'p_block_show_'+tableinfo.id+'_fields'" data-toggle="collapse" v-bind:data-target="'#block_show_'+tableinfo.id+'_fields'"></span>
				</div>
				<div v-bind:id="'block_show_'+tableinfo.id+'_fields'" class="panel-body collapse in">
					<div class="col-xs-2 padding1"><div class="sybn_th">字段名</div></div>
					<div class="col-xs-1 padding1"><div class="sybn_th">类型</div></div>
					<div class="col-xs-1 padding1"><div class="sybn_th">状态</div></div>
					<div class="col-xs-1 padding1"><div class="sybn_th">是否可为空</div></div>
					<div class="col-xs-2 padding1"><div class="sybn_th">数据来源</div></div>
					<div class="col-xs-2 padding1"><div class="sybn_th">简介</div></div>
					<div class="col-xs-3 padding1"><div class="sybn_th">可选值</div></div>
					<div class="col-xs-12 padding0 odd_even" v-for="field in tableinfo.field_list">
						<div class="col-xs-2 padding0 sybn_td">{{field.name}}</div>
						<div class="col-xs-1 padding0 sybn_td">{{field.type}}</div>
						<div class="col-xs-1 padding0 sybn_td">{{field.status}}</div>
						<div class="col-xs-1 padding0 sybn_td">{{field.hasNull}}</div>
						<div class="col-xs-2 padding0 sybn_td">{{field.source}}</div>
						<div class="col-xs-2 padding0 sybn_td">{{field.desc}}</div>
						<div class="col-xs-3 padding0 sybn_td">
							<span v-if="JSON.stringify(field.valueMap) == '{}'">-</span>
					 		<span v-for="(value, key) in field.valueMap" class="valueinfo">{{key}}:{{value}}; </span>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	</div>
<script type="text/javascript">
		var sybn = new Vue({
			el: '#body',
			data: {
				res:{
					"result" : true,
					"msg" : "success",
					"total" : 0,
					"ps" : {
						"page" : 1,
						"size" : 20,
						"pageSizeEmptyable" : false
					},
					"rows" : []
				}
			},
			methods: {
				refreshMessage: function() {
					$.ajax({
						url : "/dw-api-core/api/helper/tableInfo.json?status=0,1",
						type : "get",
						dataType : "json",
						success : function(res) {
							sybn.res = res;
						}
					});
				}
			},
		});
		sybn.refreshMessage();


    function getQueryString(name, defaults) {
      var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
      var r = window.location.search.substr(1).match(reg);
      if (r != null) return decodeURIComponent(r[2]);
      return typeof defaults != undefined ? defaults : null;
    }
	</script>
</body>
</html>